<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>ui</title>
	</head>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<style type="text/css">
		*{
			padding: 0;
			margin: 0;
			box-sizing: border-box;
		}
		a{
			text-decoration: none;
		}
		h1{
			font-size: 50px;
			font-weight: normal;
			padding-bottom: 30px;
			padding-top: 50px;
		}
		.container{
			background: url(切图/bg.png)no-repeat;
			background-size: 100% 100%;
			height: 100vh;
		}
		.item{
			height: 100%;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.left{
			background-color: #fff;
			width: 450px;
			height: 400px;
			text-align: center;
			border-bottom-left-radius: 5px;
			border-top-left-radius: 5px;
		}
		.right{
			background: url(切图/bg-login.png);
			background-size: 100% 100%;
			width: 300px;
			height: 400px;
		}
		input{
			border-radius: 3px;
			outline: none;
			font-size: 13px;
			padding: 20px 10px 10px 40px;
			margin-bottom: 10px;
			width: 380px;
			height: 45px;
			border: 1px solid #dddddd;
			
		}
		input:nth-child(1){
			background: url(切图/yonghuming.png) no-repeat 10px center;
		}
		.dd{
			background: url(切图/mima.png) no-repeat 10px center;
		}
		button{
			outline: none;
			border-radius: 3px;
			margin-top: 25px;
			width: 382px;
			height: 41px;
			background-color: #7554bf;
			border: none;
			color: #FFFFFF;
			transition: 0.5s;
		}
		button:hover{
			background-color: #6a4eae;
		}
		.right p{
			margin-top: 80px;
			margin-left: 50px;
			line-height: 80px;
			font-size: 14px;
			color: #FFFFFF;
			background: url(切图/youjiantou.png) no-repeat 80px 105px;
		}
		@media (max-width: 640px) {
			.item{
				flex-wrap: wrap;
			}
			.left{
				width: 100%;
				height: 350px;
			}
			input{
				width: 100%;
			}		
			button{
				width: 100%;
			}
		}
	</style>
	<body>
		<div class="container">
			<div class="item">
				<div class="left">
					<h1>LOGO</h1>
					<form action="" method="post">
						<input type="text" placeholder="用户名或手机号"/><br />
						<input class="dd" type="password" placeholder="请输入登录密码"/><br />
						<button>登录</button>
					</form>
				</div>
					<a class="right" href="#">
						<p>企业注册及企业认领通道<br />
							注册及认领
						</p>
					</a>
			</div>
		</div>
	</body>
</html>
